<template>
	<view class="repair-wrap">
		<viewData :type="'noData'" :nextPage="!nextPage" :isTab="false" :isData="listData.length < 1" :loading="loading"
				  @onRefresh="onRefresh">
			<view class="tab_nav" style="background-color: #FFFFFF;">
				<view class="navTitle" v-for="(item,index) in navList" :key="index" >
					<view :class="{'active':isActive === index}" @click="checked(item.index)">
						{{item.title}}
					</view>
				</view>
			</view>
			<view class="u-m-t-20 repair-box " v-if="isActive==0" style="padding: 40px 30px;">
				<view class="nav_item" style="margin-top: -22px;" @click="detail()">
					<view style="display: flex;" >
						<view >
							<h3>物业费</h3>
						</view>
					</view>
					<view style="float: right;margin-top: -26px;">
						<view>待开票</view>
					</view>
					<view style="display: flex;margin-top: 10px;font-family: Verdana, STFangsong, 苹方-简;">
						<view style="#666666">楼宇号：</view>
						<view style="color: #999999;">1区-2-101</view>
					</view>
					<view style="display: flex;margin-top: 10px;">
						<view style="#666666">发票金额：</view>
						<view style="#333333">1000.00</view>
					</view>
					<view style="display: flex;margin-top: 10px;">
						<view style="#666666">申请日期：</view>
						<view style="#333333">2022-01-12</view>
					</view>
					
				</view>
			</view>
			<!-- <view class="u-m-t-20 repair-box  u-p-l-40 u-p-r-40" style="padding: 45px;" v-for="(item,index) in classList" v-if="isActive==1">
				<view class="nav_item" style="margin-top: -22px;">
					<view style="display: flex;" >
						<view >
							<h3>{{item.goods_title}}</h3>
						</view>
					</view>
					<view style="float: right;margin-top: -26px;">
						<h3>{{item.project_name}}</h3>
					</view>
					<view style="display: flex;margin-top: 10px;font-family: Verdana, STFangsong, 苹方-简;">
						<view style="#666666">拾取时间：</view>
						<view style="color: #999999;">{{item.pick_time}}</view>
					</view>
					<view style="display: flex;margin-top: 10px;">
						<view style="#666666">拾取地点：</view>
						<view style="#333333">{{item.pick_address}}</view>
					</view>
					<view style="margin-top: 10px;">
						<image style="width: 100px;height: 100px;" @click="preview(item.goods_images)" :src="item.goods_images" ></image>
					</view>
					<view style="display: flex;margin-top: 10px;">
						<view style="#666666">联系人员：</view>
						<view style="#666666">{{item.contact_person}}</view>
					</view>
					<view style="float: right;margin-top: -21px;">
						<view style="display: flex;">
							<view style="#666666">联系电话：</view>
							<view style="#666666">{{item.contact_phone}}</view>
						</view>
						
					</view>
					<view style="display: flex;margin-top: 10px;color: #999999;">
						<view style="#666666">领取地址：</view>
						<view style="#333333">{{item.projectAddress || '无'}}</view>
					</view>
					<view style="display: flex;margin-top: 10px;color: #999999;">
						<view style="#666666">领取时间：</view>
						<view style="#333333">{{item.update_time}}</view>
					</view>
					<view style="float: right;margin-top: 10px;">
						<view style="display: flex;;color: #999999;">
							<view style="#666666">发布时间：</view>
							<view style="#999">{{item.begin_time}}</view>
						</view>
					</view>	
				</view> -->
			<!-- </view> -->
		</viewData>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isActive: 0,
				classList:[],
				is_receive:null,//是否领取(0.否1.是)
				navList:[
					{
						index: 0,
						title: '待开票'
					},{
						index: 1,
						title: "已开票"
					}
				],
				pageIndex:1,
				loading: false,
				// type: 1,
				nextPage:false,
				listData:[],
			}
		},
		onShow() {
			let _this = this
			if (uni.getStorageSync('phone')) {
				if (uni.getStorageSync('loginFlag')) {
					if (!uni.getStorageSync('hourseList')) {
						// uni.showModal({
						// 	title: '请先进行业主认证',
						// 	showCancel: false,
						// 	confirmText: '确认',
						// 	confirmColor: '#F9A832',
						// 	success: function(res) {
						// 		if (res.confirm) {
						// 			_this.$Router.push({
						// 				path: '/pages/address/address'
						// 			})
						// 		}
						// 	}
						// });
						this.$openInvite()
					} else {
						_this.showFlag = true
						_this.homelist = uni.getStorageSync('hourseList')[uni.getStorageSync('hourseNum') || 0]
						_this.name = _this.homelist.proName;
						_this.address = _this.homelist.buildDistrictCode + '-' + _this.homelist.buildTowerCode + '-' + _this.homelist.roomUnitNumber +'-'+ _this.homelist.roomCode
						
					}
				} else {
					uni.showModal({
						title: '请先实名认证',
						showCancel: false,
						confirmText: '确认',
						confirmColor: '#F9A832',
						success: function(res) {
							if (res.confirm) {
								_this.$Router.push({
									path: '/pages/realName/realName'
								})
							}
						}
					});
				}
			} else {
				uni.showModal({
					title: '请先登录',
					showCancel: false,
					confirmText: '确认',
					confirmColor: '#F9A832',
					success: function(res) {
						if (res.confirm) {
							console.log('a')
							_this.$Router.pushTab({
								path: '/pages/user/user'
							})
						}
					}
				});
			}
		},
		
		methods: {
			onRefresh() {
				if (!this.nextPage) {
					this.pageIndex = this.pageIndex + 1;
				}
			},
			//获取待开票信息
			getList(){
				this.$request.api.getInvoite({
					
				})
			},
			detail(){
				uni.navigateTo({
					url: '/pages/invoice/invoiceDetail'
				})
			},
			checked(index) {
				this.isActive = index;
				this.getRepaireClass();
			},
		}
	}
</script>


<style lang="scss">
	.repair-wrap {
		width: 100%;
		min-height: 100vh;
		height: auto;
		background: #f4f4f4;
		overflow: hidden;

		.repair-box {
			background: #fff;

			.repair-titel {
				height: 44rpx;
				line-height: 44rpx;

				.repair-titel-l {
					float: left;
				}

				.repair-titel-r {
					float: right;
					color: #999;
				}
			}

			.repair-6 {
				color: #666;
			}
		}
	}
	.tab_nav{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.tab_nav  .navTitle {
		height: 90rpx;
		line-height: 90rpx;
		width: 100%;
		text-align: center;
		font-size: 32rpx;
		font-family: Alibaba PuHuiTi;
		color: #333;
	}
	.active {
		position: relative;
		color: #427705 ;
	}
	.active::after {
		content: "";
		position: absolute;
		width: 100rpx;
		height: 4rpx;
		background-color: #427705 ;
		left: 0px;
		right: 0px;
		bottom: 0px;
		margin: auto;
	}
	.add-process {
		width: 102rpx;
		height: 102rpx;
		position: fixed;
		right: 36rpx;
		bottom: 230rpx;
	}
</style>
